<?php
/********************************************************************************
 * File:          index.php
 * Description:   The main page.  Displays one photo along with the photo's 
 *                description, EXIF data and comments.
 * Parameters:    id (optional, int) - The photo id to display.  If none, most 
 *                the recent photo is shown.
 ********************************************************************************/
 
 /**
  * Todo:
  * Rewrite php files to use statis html vs. php echo
  * Reorganize files to improve performance
  * Create install.php to guide user through building config file
  * Create three themes
  * Change photo resize logic to better handle portrait photos
  * Enable dynamic themeing
  * Add side tabs to info_comments page for: description, exif, comments (i.e. mootools)
  * Pretty-up the sets and latests pages
  */
require_once("inc/header.php");

/**
* If 'id' was not passed in grab the most recent photo
*/
if (!$_GET['id']) {
   $photos = $f->photos_search(array("user_id"=>$config_flickrUserId, "extras"=>"original_format,date_taken,date_posted", "per_page"=>"1", "page"=>"1"));
   $id = $photos['photo'][0]['id'];
}
else {
   $id = $_GET['id'];
} 

/**
* Get the photo's info and next/prev images
*/
$info = $f->photos_getInfo($id);
$context = $f->photos_getContext($id);

/**
* The default size is "medium" which is 500px wide.  We scale photos to
* 740px wide so see if the user uploaded a larger version of this photo
* that we can use.  Otherwise we'll stretch the image.
*/
$photoSizes = $f->photos_getSizes($id);
$photoSize = ""; // medium is 500px wide
foreach ($photoSizes as $photoSize) {   
   if ((int)$photoSize['width'] > 500) {
      $photoSize = $photoSize['label'];
      break;
   }
}
$currPhoto = $f->buildPhotoURL($info, $photoSize);

/**
* Get the EXIF data
*/
$exifLabels = array(
   "Make" => "", 
   "Model" => "", 
   "Software" => "", 
   "Exposure" => "", 
   "Aperture" => "",
   "Shutter Speed" => "",
   "ISO Speed" => "",
   "Flash" => "",
);
$exif = $f->photos_getExif($id);
$exifData = "";
foreach ($exif['exif'] as $exifItem) {
   if (array_key_exists($exifItem['label'], $exifLabels)) {
      if ($exifItem['clean']) {
         $exifData .= $exifItem['label'] . ": " . $exifItem['clean'] . "<br/>";
      }
      else {
         $exifData .= $exifItem['label'] . ": " . $exifItem['raw'] . "<br/>";
      }
   }
}

/**
* Get the comments
*/
$commentData = "";
if ($info['comments']) {
   $comments = $f->photos_comments_getList($id);
   foreach ($comments['comment'] as $comment) {
      $commentData .= $comment['authorname'] . " says:<br/>";
      $commentData .= $comment['_content'] . "<br/><br/>";
   }
}
?>


<!-- Image title and next/prev buttons -->
<div id='page_header'>
   <span id='page_title'><?php echo $info['title']; ?></span>
   <span id='page_nav'>
      <a href='index.php?id=<?php echo $context['prevphoto']['id']; ?>' title='<?php echo $context['prevphoto']['title']; echo "::";?>' class='photo'>prev </a>
      <?php if (0 < $context['nextphoto']['id']) { ?>
      <a href='index.php?id=<?php echo $context['nextphoto']['id']; ?>' title='<?php echo $context['nextphoto']['title']; echo "::";?>' class='photo'>next</a>
      <?php } ?>
   </span>
</div>

<!-- The image -->
<div id='page'>
   <div id='info_comments'>
      <div id='description'>
         <h2>description</h2><?php echo $info['description']; ?>
      </div>
      <div id='exif'>
         <h2>exif</h2><?php echo $exifData; ?>
      </div>
      <div id='comments'>
         <h2>comments</h2><?php echo $commentData; ?>
      </div>
      <a href='<?php echo $info['urls']['url'][0]['_content']; ?>'>Leave a comment</a>
   </div>
   <a href='index.php?id=<?php echo $context['prevphoto']['id']; ?>' alt='<?php echo $info['title']; ?>'>
      <img id='photo' class='photo' src='<?php echo $currPhoto; ?>' title="<?php echo $info['title']; echo " :: "; echo $info['description']; ?>" alt='' />
   </a>
</div>

<!-- Image meta data: date posted and comments link -->
<div id='page_meta'>
   <span style='float:left'><?php echo date("F j, Y", $info['dates']['posted']); ?></span>
   <span style='float:right'>
      <a id='info_comments_toggle' name='info_comments_toggle' href='#'>Info & Comments (<?php echo $info['comments']; ?>)</a>
   </span>
</div>

<!-- Javascript effects -->
<script type='text/javascript' src='js/mootools.v1.11.js'></script>
<script type='text/javascript'>
   window.addEvent('domready', function(){
      /**
      * Photo tool tip effect
      */
      var PhotoNav = new Tips($$('.photo'));   

      /**
      * Slide effect for photo details
      */      
      var fade = new Fx.Style('info_comments', 'opacity', {duration:800});
      fade.hide();
      $('info_comments_toggle').addEvent('click', function(e){
         fade.start(0.85);
      });
      $('info_comments').addEvent('click', function(e){
         fade.start(0);
      });
      
      /**
      * Size the photo
      */
   });
</script>

<?php
require_once("inc/footer.php"); 
?>
